import { defineConfig, loadEnv, type ConfigEnv } from 'vite'
import vue from '@vitejs/plugin-vue'
import path from 'path'
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
import { createSvgIconsPlugin } from 'vite-plugin-svg-icons'
import WindiCSS from 'vite-plugin-windicss' //引入Windicss插件
import vueSetupExtend from 'vite-plugin-vue-setup-extend' // 导入插件包设置在setup上添加name
// https://vitejs.dev/config/
const viteConfig = defineConfig((mode: ConfigEnv) => {
  // 获取环境变量
  const env = loadEnv(mode.mode, process.cwd())
  return {
    plugins: [
      vue(),
      WindiCSS(), //注册Windicss插件

      // 自动导入插件
      AutoImport({
        // 自动导入图标组件
        resolvers: [ElementPlusResolver()],
        imports: ['vue', 'vue-router', '@vueuse/core', 'pinia'],
        // 生成自动导入的TS声明文件
        dts: 'types/auto-imports.d.ts',
        // 配置本地需要自动导入的库
        dirs: [
          // 自定义组合式api目录
          'src/composables',
          // pinia状态管理目录
          'src/store',
          // 工具函数或者工具类
          'src/utils',
        ],
      }),
      Components({
        // 导入Elementplus的配置项目
        resolvers: [ElementPlusResolver()],
        // 生成类型的地址
        dts: 'types/components.d.ts',
        // 指定自动导入的组件位置，默认是 src/components
        dirs: ['src/components'],
      }),
      // icon注册
      createSvgIconsPlugin({
        // Specify the icon folder to be cached
        iconDirs: [path.resolve(process.cwd(), 'src/assets/icons')],
        // Specify symbolId format
        symbolId: 'icon-[dir]-[name]',
      }),
      vueSetupExtend(),
    ],
    // 设置全局变量的样式
    css: {
      preprocessorOptions: {
        scss: {
          javascriptEnabled: true,
          additionalData: '@import "./src/styles/variable.scss";',
        },
      },
    },
    resolve: {
      // 配置@ 转换为./src
      alias: {
        '~': path.resolve('./src'), // 相对路径别名配置，使用 @ 代替 src
      },
      extensions: ['.ts', '.vue', '.js', '.jsx', '.tsx'], // 导入时想要省略的扩展名列表。
    },
    // 服务
    server: {
      host: '0.0.0.0',
      port: env.VITE_PORT as unknown as number,
      proxy: {
        [env.VITE_APP_BASE_API]: {
          target: env.VITE_SERVE,
          changeOrigin: true,
          rewrite: (path) => path.replace(/^\/api/, ''),
        },
      },
    },
    //预览效果
    preview: {
      port: 8081,
      open: true,
    },
    // * 打包去除 console.log && debugger
    esbuild: {
      pure: ['console.log', 'debugger'],
    },
    build: {
      // 禁用 gzip 压缩大小报告，可略微减少打包时间
      reportCompressedSize: false,
      /** 消除打包大小超过 500kb 警告 */
      chunkSizeWarningLimit: 2000,
      /** 在打包代码时移除 console.log、debugger 和 注释 */
      rollupOptions: {
        // 静态资源分类打包
        output: {
          chunkFileNames: 'static/js/[name]-[hash].js',
          entryFileNames: 'static/js/[name]-[hash].js',
          assetFileNames: 'static/[ext]/[name]-[hash].[ext]',
          manualChunks(id) {
            if (id.includes('node_modules')) {
              return (
                id
                  .toString()
                  .match(/\/node_modules\/(?!.pnpm)(?<moduleName>[^\/]*)\//)
                  ?.groups!.moduleName ?? 'vender'
              )
            }
          },
        },
      },
    },
  }
})
export default viteConfig
